<template>
      <img class="thumb" v-if="isLoding" :src="thumb" alt="thumb">
      <img class="imgurl" :src="imgUrl" @load="loaded" alt="img">
</template>

<script>
import {ref} from 'vue'
export default {
    props:{
        thumb:{
            type:String
        },
        imgUrl:{
            type:String,
        }

    },
    setup(){
        const isLoding = ref(true);
        const loaded = ()=>{
            isLoding.value = false;
        }
        return{
            isLoding,
            loaded
        }
    }
}
</script>

<style lang="less" scoped>
    img{
        width: 100%;
        height: 100%;
        position:absolute;
    }
    .thum{
        z-index: 2;
    }
    .imgUrl{
        z-index: 1;
    }
</style>
